<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<input type="hidden" name="id" value="${sessionScope.mvo.id }">
<input type="hidden" name="membertype" value="${sessionScope.mvo.membertype}">
<c:choose>
<%-- 
	로그인이 되었을때 기본 적인 로직이 수행되고 
	로그인이 안되었을 때는 로그인을 수행하도록 페이지를 이동한다.
--%>
	<c:when test="${sessionScope.mvo!=null}">
	
<script type="text/javascript">
	$(document).ready(function(){
		/* $("#inputAvailabledaytimr").on("#addressPopupBtn","click",function(){
			alert("test");
			window.open("addressPopupForUpdate.jsp", "popup", "width=350, height=200");
		}); */
		$("#addressPopupBtn").click(function(){
			alert("test");
			window.open("addressPopupForUpdate.jsp", "popup", "width=350, height=200");
		});
		//초기에 화면에 뿌려줄 내용
		//$("#total_gugunDiv").hide();
		$.ajax({
			type:"POST",
			url:"hopeSubjectList.do",
			dataType:"json",
			success:function(jsonData){	
				
					//시도 리스트 가져와서 뿌리기
				$("#userHoperegion option").remove();
				var op="<option value='false'>-----------------</option>";
				$("#userHoperegion").append(op);
 				$.each(jsonData.sidoList,function(index, sidoList){	//jsonData.sidoList을 sidolist란 이름으로 사용
 					op="<option value="+sidoList.code_code+">"+sidoList.code_name+"</option>";
					$("#userHoperegion").append(op); 
				});   
		
 				//희망과목 가져와서 뿌리기
				$("#userHopesubject option").remove();
				op="<option value='false'>-----------------</option>";
				$("#userHopesubject").append(op);
 				$.each(jsonData.hopeSubjectList,function(index,hopesubjectlist){
 					op="<option value="+hopesubjectlist.code_code+">"+hopesubjectlist.code_name+"</option>";
					$("#userHopesubject").append(op); 
				});
 					//성별 가져와서 뿌리기
				$("#radioGender input").remove();
				op="";
 				$.each(jsonData.genderList,function(index, genderlist){
 					op="<input type='radio' name='userGender' value="+genderlist.code_code+">"+genderlist.code_name+"</option>";
					$("#radioGender").append(op); 
				});
 				$("#radioHopegender input").remove();
				op="";
 				$.each(jsonData.genderList,function(index, genderlist){
 					op="<input type='radio' name='userHopegender' value="+genderlist.code_code+">"+genderlist.code_name+"</option>";
					$("#radioHopegender").append(op); 
				});
 	 				//학교학년 가져와서 뿌리기
				$("#userGrade option").remove();
				op="<option value='false'>------------------------</option>";
				$("#userGrade").append(op);
 				$.each(jsonData.gradeList,function(index, gradelist){
 					op="<option value="+gradelist.code_code+">"+gradelist.code_name+"</option>";
					$("#userGrade").append(op); 
				}); 
			
			}//success
		});//ajax
		
		$("#userHoperegion").change(function(){
			userSido=$(this).val();
			if(userSido=='false'){//시도 값이 바뀌었는데 --을 선택한 경우
				$("#userGugun").hide();
			}else{						
				$("#userGugun").show();				
			}
			$.ajax({
				type:"POST",
				url:"gugunList.do",
				data:"code_code="+userSido,
				dataType:"json",
				success:function(jsonData){
	 				//구군정보 가져와서 뿌리기
					$("#userGugun option").remove();
					var op="<option value='false'>--</option>";
					$("#userGugun").append(op);
	 				$.each(jsonData,function(index, codemaster){
	 					op="<option value="+codemaster.code_code+">"+codemaster.code_name+"</option>";
						$("#userGugun").append(op); 
					});
				}
			});
		});
		
		$(".updateVal").click(function(){
			$(this).val("");
		});
		$(".edit").click(function(){
			$(this).next().next().toggle();// div .input
			
			$(".input").each(function(i){
				$(".form")[i].reset();
			});
			
			if($("#userHoperegion").val()=='false'){//수정버튼을 눌러 폼이 등장할때 --을 선택한 경우
				$("#userGugun").hide();
			}
			//$(".form")[1].reset();// form의 입력정보를 리셋
		});
		$(".cancelButton").click(function(){
			$(this).parent().parent().parent().toggle();// div .input
		});
		$(".saveButton").click(function(){
			
			var inputMember =$(this);
			var dataString ="id="+$("input[name=id]").val()+"&membertype="+$("input[name=membertype]").val();
			var urlData ="";
			// label의 text값에 따라 넘겨지는 값이 다르도록 코드를 생성
			if($(this).parent().parent().parent().prev().prev().prev().text()=="이름"){
				dataString+="&name="+$("#userName").val();
				urlData="updateMember.do";
				$.ajax({
					type:"post",
					url:urlData,
					dataType:"json",
					data:dataString,
					success:function(jsonData){
						inputMember.parent().parent().parent().hide().prev().text(jsonData.name);
					}
				});
			}else if($(this).parent().parent().parent().prev().prev().prev().text()=="성별"){
				dataString+="&gender="+$("input[name=userGender]:checked").val();
				urlData="updateMember.do";
				$.ajax({
					type:"post",
					url:urlData,
					dataType:"json",
					data:dataString,
					success:function(jsonData){
						inputMember.parent().parent().parent().hide().prev().text(jsonData.gender);
					}
				});
			}else if($(this).parent().parent().parent().prev().prev().prev().text()=="전화번호"){
				dataString+="&tel="+$("#userTel").val();
				urlData="updateMember.do";
				$.ajax({
					type:"post",
					url:urlData,
					dataType:"json",
					data:dataString,
					success:function(jsonData){
						inputMember.parent().parent().parent().hide().prev().text(jsonData.tel);
					}
				});
			}else if($(this).parent().parent().parent().prev().prev().prev().text()=="이메일 주소"){
				dataString+="&email="+$("#userEmail").val();
				urlData="updateMember.do";
				$.ajax({
					type:"post",
					url:urlData,
					dataType:"json",
					data:dataString,
					success:function(jsonData){
						inputMember.parent().parent().parent().hide().prev().text(jsonData.email);
					}
				});
			}else if($(this).parent().parent().parent().prev().prev().prev().text()=="학년"){
				dataString+="&grade="+$("#userGrade").val();
				urlData="updateStudent.do";
				$.ajax({
					type:"post",
					url:urlData,
					dataType:"json",
					data:dataString,
					success:function(jsonData){
						inputMember.parent().parent().parent().hide().prev().text(jsonData.grade);
					}
				});
			}else if($(this).parent().parent().parent().prev().prev().prev().text()=="희망 과목"){
				dataString+="&hopesubject="+$("#userHopesubject").val();
				urlData="updateStudent.do";
				$.ajax({
					type:"post",
					url:urlData,
					dataType:"json",
					data:dataString,
					success:function(jsonData){
						inputMember.parent().parent().parent().hide().prev().text(jsonData.hopesubject);
					}
				});
			}else if($(this).parent().parent().parent().prev().prev().prev().text()=="희망 지역"){
				dataString+="&hoperegion="+$("#userGugun").val();
				urlData="updateMember.do";
				$.ajax({
					type:"post",
					url:urlData,
					dataType:"json",
					data:dataString,
					success:function(jsonData){
						inputMember.parent().parent().parent().hide().prev().text(jsonData.hoperegion);
					}
				});//ajax
			}else if($(this).parent().parent().parent().prev().prev().prev().text()=="사는 지역"){
				dataString+="&zipcode="+$("#userZipcode").val()+"&codeaddress="+$("#userCodeaddress").val()+"&subaddress="+$("#userSubaddress").val();
				urlData="updateStudent.do";
				$.ajax({
					type:"post",
					url:urlData,
					dataType:"json",
					data:dataString,
					success:function(jsonData){
						inputMember.parent().parent().parent().hide().prev().html(jsonData.codeaddress+"<br>"+jsonData.subaddress);
					}
				});
			}
			
			//updateData($(this),urlData,dataString,sourceType);
		});
		$(".item").hover(
				function() {
					$(this).toggleClass("on");
				}
		);
		$(".input").hide();
		
	});
	
	
	// ajax 기능을 통합한 소스  jsonData parsing을 성공할 방법이 있다면 사용 예정;
	/* function updateData(inputMember,urlData,dataString,sourceType){
		//alert($("#userName").val());
		//var inputMember =$(this);
		$.ajax({
			type:"post",
			url:urlData,
			dataType:"json",
			data:dataString,
			success:function(jsonData){
				inputMember.parent().parent().hide().prev().text(jsonData.name);
			}
		}); 
	}*/
</script>   
    

<div id="profile_container">
	<div id="basic">
		<div id="name" class="item">
		<div class="label">이름</div><div class="edit">수정</div>
		<div class="profileInfo">${requestScope.mvo.name }</div>
		 	<div id="inputName" class="input">
		 		<form class="form">
			 			<input class="updateVal" type="text" id="userName" value="이름은 무엇인가요?">
			 		<div class="inputButton">
				 		<input class="saveButton" type="button" value="저장">
				 		<input class="cancelButton" type="button" value="취소">
				 	</div>
				</form>
		 	</div>
		</div>
		<div id="gender" class="item">
		<div class="label">성별</div><div class="edit">수정</div>
		 <div class="profileInfo">${requestScope.mvo.gender }</div>
		 	<div id="inputGender" class="input">
		 		<form class="form">
				 		<span id="radioGender"></span>
			 		<div class="inputButton">
				 		<input class="saveButton" type="button" value="저장">
				 		<input class="cancelButton" type="button" value="취소">
				 	</div>
				</form>
		 	</div>
		</div>
		<div id="tel" class="item">
		<div class="label">전화번호</div><div class="edit">수정</div>
		 <div class="profileInfo">${requestScope.mvo.tel }</div>
		 	<div id="inputTel" class="input">
		 		<form class="form">
				 		<input class="updateVal" type="text" id="userTel" value="전화번호는 무엇인가요?">
			 		<div class="inputButton">
				 		<input class="saveButton" type="button" value="저장">
				 		<input class="cancelButton" type="button" value="취소">
				 	</div>
				</form>
		 	</div>
		</div>
		<div id="email" class="item">
		<div class="label">이메일 주소</div><div class="edit">수정</div>
		 <div class="profileInfo">${requestScope.mvo.email }</div>
		 	<div id="inputEmail" class="input">
		 		<form class="form">
				 		<input class="updateVal" type="text" id="userEmail" value="이메일은 무엇인가요?">
			 		<div class="inputButton">
				 		<input class="saveButton" type="button" value="저장">
				 		<input class="cancelButton" type="button" value="취소">
				 	</div>
				</form>
		 	</div>
		</div>
		<div id="grade" class="item">
		<div class="label">학년</div><div class="edit">수정</div>
		 <div class="profileInfo">${requestScope.mvo.grade }</div>
		 	<div id="inputGrade" class="input">
		 		<form class="form">
			 		<select id = "userGrade">
						<option>----</option>
					</select>	
				 	<div class="inputButton">
					 	<input class="saveButton" type="button" value="저장">
					 	<input class="cancelButton" type="button" value="취소">
					</div>
				</form>
		 	</div>
		</div>
	</div>
	<div id="append">
		<div id="hoperegion" class="item">
		<div class="label">희망 지역</div><div class="edit">수정</div>
		 <div class="profileInfo">${requestScope.mvo.hoperegion }</div>
		 	<div id="inputHoperegion" class="input">
			 	<form class="form">
			 		<select id = "userHoperegion">
						<option>----</option>
					</select>	
					<select id = "userGugun">
						<option>----</option>
					</select>
				 	<div class="inputButton">
					 	<input class="saveButton" type="button" value="저장">
					 	<input class="cancelButton" type="button" value="취소">
					</div>
				</form>
			</div>
		</div>
		<div id="hopesubject" class="item">
		<div class="label">희망 과목</div><div class="edit">수정</div>
		 <div class="profileInfo">${requestScope.mvo.hopesubject }</div>
		 	<div id="inputHopeSubject" class="input">
			 	<form class="form">
			 		<select id = "userHopesubject">
						<option value = "">--</option>
					</select>	
				 	<div class="inputButton">
					 	<input class="saveButton" type="button" value="저장">
					 	<input class="cancelButton" type="button" value="취소">
					</div>
				</form>
			</div>
		</div>
		<div id="studentAddress" class="item">
		<div class="label">사는 지역</div><div class="edit">수정</div>
		<div>
		 <div class="profileInfo">${requestScope.mvo.codeaddress }</div>
		 <div class="profileInfo">${requestScope.mvo.subaddress }</div>
		</div>
		<div id="inputAvailabledaytimr" class="input">
			 		<form class="form">
			 				<input class="updateVal" type="text" id="userZipcode" readonly="readonly">
				 		    <input class="updateVal" type="text" id="userCodeaddress">
				 		    <input type="button" id="addressPopupBtn" value="주소검색">
				 		    <input class="updateVal" type="text" id="userSubaddress">
				 		     
					 	<div class="inputButton">
						 	<input class="saveButton" type="button" value="저장">
						 	<input class="cancelButton" type="button" value="취소">
						</div>
					</form>
				</div>
		</div>
	</div>
</div>
</c:when>
	<c:otherwise>
		<c:choose>
			<c:when test="sessonScope.mvo.membertype==t">
				<script type="text/javascript">
					var path ="/profileTeacher.do?id="+$("input[name=id]").val()+"&membertype="+$("input[name=membertype]").val();
					location.href="loginResult.do?path="+path;
				</script>
			</c:when>
			<c:otherwise>
				<script type="text/javascript">
					var path ="/profileStudent.do?id="+$("input[name=id]").val()+"&membertype="+$("input[name=membertype]").val();
					location.href="loginResult.do?path="+path;
				</script>
			</c:otherwise>
		</c:choose>
	</c:otherwise>
</c:choose>